<template>
  <div class="footer">
    <div class="footer-box w1200">
      <span style="margin-right: 30px">友情链接:
        <span class="footer-link" v-for="(item,index) in footerlist" :key="index">
            <a :href="item.webUrl" target="_blank" style="margin-right: 20px">
              {{item.title}}
            </a>
        </span>
      </span>
      <div class="footer-dizhi flex">
        <div class="dingzhi-img">
          <img src="../../assets/images/dizhi.png" class="img">
        </div>
        <span class="address flex1">地址：武汉市洪山区珞狮路122号</span>
        <div class="qrcode flex">
          <span>扫一扫</span>
          <img src="../../assets/images/erweima.jpg">
        </div>
      </div>
      <div class="footer-copyright">
        <span>研究生创新创业平台</span>
        <span>版权所有</span>
        <span>备案号: xxxxxxxx</span>
      </div>
    </div>
  </div>
</template>

<script>
  export default {
    data() {
      return {
        footerlist:[]
      }
    },
    mounted() {
    },
    computed:{
      footer() {
        return this.$store.state.links    
      }
    },
    watch:{
      footer(val) {
        this.footerlist = val
      }
    },
    methods:{
      
    }
  }
</script>

<style lang="scss">
  @import "../../assets/css/common.css";
  .footer {
    // position: absolute;
    // bottom: 0;
    width: 100%;
    height: 190px;
    margin: 0 auto;
    .footer-box {
      position: relative;
      margin: 0 auto;
      border-top: 1px solid #3246c4;
      padding-top: 30px;
      .footer-link {
        margin-top: 25px;
        font-size: 14px;
        color: #555555;
      }
      .footer-dizhi {
        margin-top: 20px;
        .dingzhi-img {
          width: 30px;
          height: 30px;
          float: left;
        }
        img {
          vertical-align: middle;
        }
        .address {
          margin-left: 10px;
          color: #33a0ff;
          font-size: 14px;
        }
        .qrcode {
          position: absolute;
          right: 0;
          top: 27px;
          align-items: center;
        }
      }
      .footer-copyright {
        margin-top: 20px;
        font-size: 14px;
        color: #999999;
        font-weight: 600;
      }
    }
  }
</style>